<template>
	<view class="mainPage">
		<view class="header">
			<view class="text-left padding text-xl text-black to-back" @tap="toBack">
				<text class="cuIcon-close text-bold"></text>
			</view>
			<image :src="WEBCONFIG.web_logo" v-if="WEBCONFIG.web_logo" class="logo"></image>
			<image src="@/static/logo.png" v-else class="logo"></image>
			<view class="webname margin-top">
				登录<text class="themeColor">{{WEBCONFIG.web_name}}</text>
			</view>
		</view>

		<login ref="loginRef" @success="toBack" :show-logo="false" @wx-login="wxLogin"/>
	</view>
</template>

<script>
import { mapState } from 'vuex'
export default {
	data() {
		return {

		}
	},
	computed: {
		...mapState({
			WEBCONFIG: state => state.WEBCONFIG
		})
	},
	onLoad() {
		this.$nextTick(() => {
			this.$refs.loginRef.show();
		})
	},
	methods: {
		toBack() {
			this.$utils.$page.back();
		},
        wxLogin(){
            this.$utils.wxLogin(this,{})
        }
	}
}
</script>

<style lang="scss" scoped>
.header {
	background: url(@/static/login-bg.png) no-repeat;
	background-size: cover;
	// padding-top: var(--status-bar-height);
	position: relative;
	text-align: center;
	margin-top: -150upx;

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 170rpx;
		border-radius: 30rpx;
	}

	.to-back {
		padding-top: 170rpx;
	}
}
.mainPage{
	display: flex;
	flex-direction: column;
	--theme-bg-color-light:#FFFFFF;
}
.webname {
	font-size: 35upx;
}</style>
